<!DOCTYPE html>
<html lang="">
<head>

  <title>公众服务监督平台</title>

  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="公众服务监督平台">

  <!-- use http://www.favicon-generator.org/ to replace files in public/icon-->
  <link rel="stylesheet" href="assets/css/bootstrap.css">
  <link rel="stylesheet" href="assets/css/font-awesome.css">
  <link rel="stylesheet" href="assets/css/psmp.css">
  <meta name="msapplication-TileColor" content="#00bcd4">
  <meta name="msapplication-TileImage" content="psmpweb/assets/icon/ms-icon-144x144.png">
  <meta name="theme-color" content="#00bcd4">
  <!-- end favicon -->

  <!-- base url -->
  <base href="/">
  <style type="text/css">
    .loader {
      width: 30%;
      height: 200px;
      margin: 0 auto;
      box-sizing: border-box;
      display: flex; /*设置弹性拉伸布局*/
      align-items: center; /*设置元素中的每项水平居中*/
      justify-content: center; /*设置元素中的每项垂直居中*/
      text-align: center;
    }

    .loading-3 {
      position: relative;
    }

    .loading-3 i {
      display: block;
      position: absolute;
      width: 15px;
      height: 15px;
      border-radius: 50%;
      background: #333;
    }

    .loading-3 i:nth-child(1) {
      top: 25px;
      left: 0;
      -webkit-animation: loading3 1s ease-in 0s infinite;
    }

    .loading-3 i:nth-child(2) {
      top: 17px;
      left: 17px;
      -webkit-animation: loading3 1s ease-in 0.12s infinite;
    }

    .loading-3 i:nth-child(3) {
      top: 0;
      left: 25px;
      -webkit-animation: loading3 1s ease-in -0.24s infinite;
    }

    .loading-3 i:nth-child(4) {
      top: -17px;
      left: 17px;
      -webkit-animation: loading3 1s ease-in -0.36s infinite;
    }

    .loading-3 i:nth-child(5) {
      top: -25px;
      left: 0;
      -webkit-animation: loading3 1s ease-in -0.48s infinite;
    }

    .loading-3 i:nth-child(6) {
      top: -17px;
      left: -17px;
      -webkit-animation: loading3 1s ease-in -0.6s infinite;
    }

    .loading-3 i:nth-child(7) {
      top: 0;
      left: -25px;
      -webkit-animation: loading3 1s ease-in -0.72s infinite;
    }

    .loading-3 i:nth-child(8) {
      top: 17px;
      left: -17px;
      -webkit-animation: loading3 1s ease-in -0.84s infinite;
    }

    @-webkit-keyframes loading3 {
      50% {
        -webkit-transform: scale(0.4);
        opacity: 0.3
      }
      100% {
        -webkit-transform: scale(1);
        opacity: 1
      }
    }

    .loader h3 {
      color: #666;
      position: relative;
      top: 55px;
      left: -40px;
    }
  </style>

</head>

<body style="overflow:-Scroll;overflow-y:hidden">

<app>
  <div class="loader">
    <div class="loading-3"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div>
    <h3>Loading...</h3>
  </div>
</app>




<script>
  window.onload = function () {
//    var detail = document.getElementsByClassName("detail-div");
//    var detailSpan = document.getElementsByClassName("detail-span");
//    for (var i = 0; i < detail.length; i++) {
//      detail[i].index = i;
//      for (var i = 0; i < detailSpan.length; i++) {
//        detailSpan[i].style.width = (detail[i].offsetWidth + detail[i+1].offsetWidth) / 2 + "px";
//        console.info(detailSpan[i].style.width);
//      }
//    }
//    var sidebarActive = document.getElementsByClassName("ctrl-a");
//    for(var i=0;i<sidebarActive.length;i++){
//      sidebarActive[i].index = i;
//      sidebarActive[i].onclick = function () {
//        for(var i=0;i<sidebarActive.length;i++){
//          sidebarActive[i].className="ctrl-a";
//        }
//        this.className = "ctrl-a sidebar-active";
//      }
//    }
  }
</script>
<script type="text/javascript" src="psmpweb/polyfills.0a5fa375cda8df736015.bundle.js"></script><script type="text/javascript" src="psmpweb/vendor.b45d4476a08130ab11c7.bundle.js"></script><script type="text/javascript" src="psmpweb/main.341d998e084a4478121e.bundle.js"></script></body>
</html>
